<template>
  <div id="realNameList">


    <div class="flex_head">
      <div class="solid"></div>
      <div class="item_two">
        <h3>实名列表</h3>
      </div>
    </div>
      <el-table :data="tableData" border style="width: 100%" v-loading="loading">
        <el-table-column prop="name" label="用户名" width="180">
        </el-table-column>

        <el-table-column prop="phone"  label="手机号" width="180">
        </el-table-column>

        <el-table-column  prop="submitDate" label="提交日期" width="180">
        </el-table-column>

        <el-table-column prop="verifyDate" label="审核日期"  width="180">
        </el-table-column>

        <el-table-column prop="idCard" label="身份证号" >
        </el-table-column>

        <el-table-column label="是否通过">
          <template slot-scope='scope'>
            <el-button type="primary" size="mini" @click="updated(9,scope.row.id)">通过</el-button>
            <el-button type="primary" size="mini" @click="updated(10,scope.row.id)">不通过</el-button>
          </template>
        </el-table-column>

        <el-table-column
          prop="certificationCondition"
          label="审核状态">
        </el-table-column>

      </el-table>
      <div class="block" style="text-align: right;padding-right: 40px;">

        <el-pagination :current-page.sync="pageNumber" @current-change='handleChange' :page="pageNumber"
                       :page-size="pageSize" layout="total, prev, pager, next" :total="total">
        </el-pagination>
      </div>
    </div>

</template>

<script>
  import dateformat from 'dateformat'

  export default {
    data () {
      return {
        tableData: [],
        pageSize: 10,
        pageNumber: 1,
        total: 1,
        loading: false
      }
    },
    created() {
      this.getRealNameList()
    },
    methods: {
      getRealNameList() {
        this.loading = true;
        let params = {
          pageSize: this.pageSize,
          PageNumner: this.pageNumber
        }
        this.$api.getrealNameList(params).then(res => {
          if (res.code == '000000') {
            this.loading = false;
            console.log(res.data);
            this.tableData = res.data.list;
            this.total = res.data.totalRow;
            this.tableData.forEach(item => {

              if (item.submitDate) {
                let date = new Date(item.submitDate);
                item.submitDate = dateformat(date, 'yyyy-mm-dd HH:MM')
              }
              if (item.verifyDate) {
                let date = new Date(item.verifyDate);
                item.verifyDate = dateformat(date, 'yyyy-mm-dd HH:MM')
              }

              if (item.certificationCondition == '9') {
                item.certificationCondition = '成功'
              }
              if (item.certificationCondition == '10') {
                item.certificationCondition = '失败'
              }
              if (item.certificationCondition == '11') {
                item.certificationCondition = '待审核'
              }
            })
            this.$message({
              type: 'success',
              message: '获取实名认证列表成功'
            });

          }
        })
      },
      updated(num, id) {
        let params = {
          status: num,
          id: id
        }
        this.$api.update(params).then(res => {
          if (res.code == '000000') {
            console.log(res.data);
            this.$message({
              type: 'success',
              message: '认证成功'
            })
             this.getRealNameList()
          }
        })
      },
      handleChange(val) {
        this.pageNumber = val;
        this.getRealNameList()
      }

    }
  }
</script>

<style lang="less">
  #realNameList {
    th {
      text-align: center;
    }
    .el-button--mini{
      padding: 5px;
    }
  }
</style>
